<template>
  <div class="w-full text-14px pb-80px" v-if="list.length > 0">
    <van-tabs v-model:active="active" @change="tabsChange" class="">
      <van-tab title="待审提现" name="0">
        <div class="p-20px" v-for="item in list">
          <div
            class="w-full flex items-center justify-between pb-15px border-b"
          >
            <div>订单号：{{ item.order_no }}</div>
            <div class="text-[#F9363C]">审核中</div>
          </div>
          <div class="mt-15px pb-15px border-b">
            <div class=" ">提现金额：{{ item.price }}</div>
            <div class="mt-15px">
              提现方式：
              <span v-show="item.type == 1">WX</span>
              <span v-show="item.type == 2">ZFB</span>
              <span v-show="item.type == 3">YHK</span>
            </div>
            <div class="mt-15px flex w-full justify-between items-center">
              <div>姓名：{{ item.name }}</div>
              <div
                @click="copy(item.name)"
                class="w-66px h-26px flex justify-center items-center bg-[#2E95FF] text-white rounded-5px text-12px"
              >
                复制信息
              </div>
            </div>
            <div class="mt-15px flex w-full justify-between items-center">
              <div>手机号：{{ item.mobile }}</div>
              <div
                @click="copy(item.mobile)"
                class="w-66px h-26px flex justify-center items-center bg-[#2E95FF] text-white rounded-5px text-12px"
              >
                复制信息
              </div>
            </div>
            <div class="mt-15px flex w-full justify-between items-center">
              <div>邀请码：{{ item.no }}</div>
              <div
                @click="copy(item.no)"
                class="w-66px h-26px flex justify-center items-center bg-[#2E95FF] text-white rounded-5px text-12px"
              >
                复制信息
              </div>
            </div>
            <div class="mt-15px">提现时间：{{ item.create_time }}</div>
          </div>
          <div class="mt-15px w-full flex justify-end items-center">
            <div
              @click="agree(item.id)"
              class="w-62px h-28px flex justify-center items-center border-[#2E95FF] border text-[#2E95FF] rounded-5px"
            >
              同意
            </div>
            <div
              @click="refuse(item.id)"
              class="w-62px h-28px flex justify-center items-center border-[#2E95FF] border text-[#2E95FF] ml-15px rounded-5px"
            >
              拒绝
            </div>
          </div>
        </div>
      </van-tab>
      <van-tab title="已审提现" name="1"
        ><div class="p-20px" v-for="item in list">
          <div
            class="w-full flex items-center justify-between pb-15px border-b"
          >
            <div>订单号：{{ item.order_no }}</div>
            <div class="text-[#0CB031]">审核通过</div>
          </div>
          <div class="mt-15px pb-15px border-b">
            <div class=" ">提现金额：{{ item.price }}</div>
            <div class="mt-15px">
              提现方式： <span v-show="item.type == 1">WX</span>
              <span v-show="item.type == 2">ZFB</span>
              <span v-show="item.type == 3">YHK</span>
            </div>
            <div class="mt-15px flex w-full justify-between items-center">
              <div>姓名：{{ item.name }}</div>
              <div
                @click="copy(item.name)"
                class="w-66px h-26px flex justify-center items-center bg-[#2E95FF] text-white rounded-5px text-12px"
              >
                复制信息
              </div>
            </div>
            <div class="mt-15px flex w-full justify-between items-center">
              <div>手机号：{{ item.mobile }}</div>
              <div
                @click="copy(item.mobile)"
                class="w-66px h-26px flex justify-center items-center bg-[#2E95FF] text-white rounded-5px text-12px"
              >
                复制信息
              </div>
            </div>
            <div class="mt-15px flex w-full justify-between items-center">
              <div>邀请码：{{ item.no }}</div>
              <div
                @click="copy(item.no)"
                class="w-66px h-26px flex justify-center items-center bg-[#2E95FF] text-white rounded-5px text-12px"
              >
                复制信息
              </div>
            </div>
            <div class="mt-15px">提现时间：{{ item.create_time }}</div>
          </div>
        </div></van-tab
      >
    </van-tabs>
  </div>
  <div v-else class="mt-200px">
    <nodata></nodata>
  </div>
  <pagination
    @back="back"
    @next="next"
    :current_page="current_page"
    :last_page="last_page"
    :per_page="per_page"
    :total="total"
  ></pagination>
</template>
<script setup>
import pagination from "@/components/pagination.vue";
import { shopCashList, shopCashExamine } from "@/util/api";
import nodata from "@/components/nodata.vue";
import { showToast } from "vant";
import h5Copy from "@/util/junyi-h5-copy";
import { reactive } from "vue";
const active = ref("0");
const current_page = ref(0);
const last_page = ref(0);
const per_page = ref(0);
const total = ref(0);
const list = ref([]);
const param = reactive({
  page: 1,
  state: 0, //0是待审核 1是已审核
});
const getData = async () => {
  const res = await shopCashList(param);
  current_page.value = res.msg.current_page;
  last_page.value = res.msg.last_page;
  per_page.value = res.msg.per_page;
  total.value = res.msg.total;
  list.value = res.msg.data;
};
getData();
const back = () => {
  param.page--;
  getData();
};
const next = () => {
  param.page++;
  getData();
};
const tabsChange = (v) => {
  param.state = v;
  getData();
};
//同意
const agree = async (id) => {
  const res = await shopCashExamine({ id: id, state: 2 });
  showToast(res.msg);
  getData();
};
//拒绝
const refuse = async (id) => {
  const res = await shopCashExamine({ id: id, state: 3 });
  showToast(res.msg);
  getData();
};
const copy = (val) => {
  const res = h5Copy(val);
  if (res) {
    showToast("复制成功");
  } else {
    showToast("复制失败");
  }
};
</script>
